import Vue from 'vue'
import Vuex from 'vuex'
import axios from 'axios'
import router from './router'
Vue.use(router);
Vue.use(Vuex);


//储存变量
var state = {
  'Tshow': false,
  'leftNav': true,  //侧边栏展开关闭
  'active': true,  //loading
  'mvOffset': 0,    //mv页数偏移量
  'func': '',         //请求的api是那个方法
  'topMv': {},       //储存axios请求到的MV排行榜
  'recommendMv': {}, //储存axios请求到的推荐MV
  'id': 6452,
  'mvid': 0,
  'data': {},//储存axios请求到的推荐MV
  'PersonalInfo': {},  //储存登录信息
  'uid': 279195728,    //用户 id  默认我自己的
  'recommendSongs': {},  //每日推荐歌曲
  'type':'',           //标记点击的是歌手、专辑、歌曲
  'top5':{},            //top5
  'leftNavList':{},     //侧边栏数据
  'leftNavData':{},     //我的歌单详情
  'musicUrl':'',        //音乐URL
  'playing':false,      //音乐是否在播放
  'musicData':{},       //音乐数据
  'currentIndex':0,    //当前播放歌曲的索引
  'textIndex':0,        //测试用的
  'songReady':false,    //歌曲是否加载完毕
  'currentTime':0,      //歌曲播放时间
  'allTime':0,          //歌曲总时长
  'percent':0,          //歌曲播放百分比
  'mode':0,             //播放模式
  'lyric':null,         // 歌词
  'singleState':null,    //单曲性息
  'currentLyric':null,   //歌词
};

//处理数据状态变化
const mutations = {
  fetchData(state, payload) {   //封装axios请求
    state.active = true;
    axios({
      method: 'get',
      url: payload.url,
    }).then(function (res) {
      state.active = false;
      if (payload.func == 'getrecommend') {
        state.recommendMv = res.data;
      } else if (payload.func == 'getMvTop') {
        state.topMv = res.data;
      } else if (payload.func == 'login') {
        state.PersonalInfo = res.data;
        // state.uid = res.data.account.id;
        // console.log(state.PersonalInfo)
      } else if (payload.func == 'recommendSongs') {
        state.recommendSongs = res.data;
        // console.log(state.recommendSongs)
      } else if (payload.func == 'leftNavList') {
        state.leftNavList = res.data;
        // console.log(state.leftNavData)
      } else if (payload.func == 'leftNavData') {
        state.leftNavData={};
        state.leftNavData = res.data;
        // console.log(state.leftNavData)
      } else {
        state.data = res.data;
        // console.log(state.data.result.name)
        if(payload.url=='/top/list?idx=1'){
          state.top5=state.data.result.tracks.slice(0,5);
        }
      }

    }).catch(function (err) {
      state.active = false;
      console.log(err);
    });
  },
  playMv(state, id) {
    state.mvid = id;
    router.push({name:'mvDetail',params:{id:state.id}})
  },
  play(state, payload) {  //跳转到歌曲列表详情
    state.id = payload.id;
    state.type=payload.type;
    router.push({name:'musicStateContent',params:{id:state.id}})
  },
  singlePlay(state, payload) {  //单曲跳转到歌曲列表详情
    state.singleState = payload.single;
    state.type=payload.type;
    router.push({name:'musicStateContent',params:{id:state.singleState.id}})
  },
  titleshow(state) {
    state.Tshow = true;   //标题显示
  },
  titlehidden(state) {
    state.Tshow = false;  //标题影藏
  },
  leftNavChange(state) {  //左边导航栏展开、影藏
    state.leftNav = !state.leftNav
  },
  nextMv(state) {        //topMV下一页
    state.mvOffset = state.mvOffset - 0 + 12;
  },
  upMv(state) {             //topMv上一页
    if (state.mvOffset == 0) {
      state.mvOffset = 0
    } else {
      state.mvOffset = state.mvOffset - 0 - 12;
    }
  },
  setMusicUrl(state,payload) {
    //获取新的URL和旧的URL比较 截取时间之后的字符串相比较
    let oldUrl=state.musicUrl.substring(73,131);
    let newUrl=payload.url.substring(73,131);
    oldUrl==newUrl? state.playing=!state.playing:state.playing=true;
    state.musicUrl=payload.url;
    state.musicData=payload.data;
    if(payload.index){
      state.currentIndex=payload.index;
    }else if (state.currentLyric) {
      state.currentLyric.togglePlay()
    }
  },
  nextMusic(state) {

    if(state.songReady){
      state.currentIndex++
      state.textIndex++
      state.songReady=false
    }
  },
  prevMusic(state) {
    if(state.songReady){
      state.currentIndex--
      state.textIndex--
      state.songReady=false
    }
  },
  playCurrentLyric(state,payload) {
    state.currentLyric=payload.currentLyric;
    // console.log(state.currentLyric)
  },
  songReady(state) {
    state.songReady=true
  },
  setCurrentTime(state,payload) {
    state.currentTime=payload.time;
    state.allTime=payload.allTime;
  },
  setPercent(state,percent) {
    state.percent=percent
  },
  changeMode(state) {
    state.mode++
    if(state.mode==3){
      state.mode=0
    }
  },
  getLyric(state,lyric) {
    state.lyric=lyric
    // console.log(state.lyric)
  }
};

//处理动作（要干什么）
const actions = {
  // playMv: ({commit}) => {
  //   commit('playMv')
  // },
  getrecommend: ({commit}) => {
    commit('fetchData', {url: '/personalized/mv', func: 'getrecommend'})
  },
  getMvTop: ({commit}) => {
    commit('fetchData', {url: '/top/mv?offset=' + state.mvOffset + '&limit=12', func: 'getMvTop'})
  },
  titleshow: ({commit}) => {
    commit('titleshow')
  },
  titlehidden: ({commit}) => {
    commit('titlehidden')
  },
  leftNavChange: ({commit}) => {
    commit('leftNavChange')
  },
  nextMv: ({commit}) => {
    commit('nextMv');
    commit('fetchData', {url: '/top/mv?offset=' + state.mvOffset + '&limit=12', func: 'getMvTop'})
  },
  // upMv: ({commit}) => {
  //   commit('upMv');
  //   commit('fetchData', {url: '/top/mv?offset=' + state.mvOffset + '&limit=12', func: 'getMvTop'})
  // }
};


const getters = {
  Tshow(state) {
    return state.Tshow;
  },
  leftNav(state) {
    return state.leftNav;
  },
  active(state) {
    return state.active;
  },
  mvOffset(state) {
    return state.mvOffset;
  },
  topMv(state) {
    return state.topMv;
  },
  recommendMv(state) {
    return state.recommendMv;
  },
  data(state) {
    return state.data;
  },
  PersonalInfo(state) {
    return state.PersonalInfo;
  },
  uid(state) {
    return state.uid;
  },
  recommendSongs(state) {
    return state.recommendSongs;
  },
  paramsId(state) {
    return state.id;
  },
  type(state) {
    return state.type;
  },
  top5(state) {
    return state.top5;
  },
  leftNavList(state) {
    return state.leftNavList;
  },
  leftNavData(state) {
    return state.leftNavData;
  },
  musicUrl(state) {
    return state.musicUrl;
  },
  playing(state) {
    return state.playing;
  },
  musicData(state) {
    return state.musicData;
  },
  currentIndex(state) {
    return state.currentIndex;
  },
  textIndex(state) {
    return state.textIndex;
  },
  currentTime(state) {
    return state.currentTime;
  },
  allTime(state) {
    return state.allTime;
  },
  percent(state) {
    return state.percent;
  },
  mode(state) {
    return state.mode;
  },
  lyric(state) {
    return state.lyric;
  },
  singleState(state) {
    return state.singleState;
  },
  currentLyric(state) {
    return state.currentLyric;
  }
};

//导出 store对象
export default new Vuex.Store({
  state,
  mutations,
  actions,
  getters
});
